<template>
	
	<view class="login-other">
		<view class="other-text">
			<view class="view">或者用以下方式登录</view>	
		</view>
		<view class="other">
			<view class="other-item" @tap='loginOther("weixin")'>
				<image src="../../static/微信登录.png" mode=""></image>
				<view>微信登录</view>
			</view>
			<view class="other-item" @tap='gologintel'>
				<image src="../../static/手机登录.png" mode=""></image>
				<view @tap='gologintel'>验证码登录</view>
			</view>
			<view class="other-item" @tap='loginOther("zhifubao")' >
				<image src="../../static/QQ登录.png" mode=""></image>
				<view>支付宝登录</view>
			</view>
		</view>

</view>
</template>

<script>

	export default{
		methods:{
			gologintel(){
				uni.navigateTo({
					url:"../login-code2/login-code2"
				})
			},
		
			loginOther(mode){
				uni.login({
				provider:mode,
				success:(res)=>{
					let openid=res.authResult.openid;
					uni.getUserInfo({
						provider:mode,
						success:(res)=>{
							console.log(res);
							console.log(openid);
							
								// 将登录后请求的this.userId传递给全局变量userId
							  uni.setStorageSync('openId', openid);/**********/
							uni.navigateTo({
								url: "../index/index"
							
							})
						}
					})
				}
				})
			}
		}
		
	}
	
</script>

<style scoped>
	//其他登陆方式
	.login-other{
		padding: 80rpx 0;
		
	}
	.other-text{
		display: flex;
		padding: 70rpx 0;
	}
	
	.other-text view{
		line-height: 0rpx;
		 padding:10rpx  ;
	}
	
	.other-text:after{
		flex: 1;
		content: '';
		height: 2rpx;
		background-color: #ccc;
		
	}
	.other-text:before{
		flex: 1;
		content: '';
		height: 2rpx;
		background-color: #ccc;
	}
	.other{
		padding-top: 30rpx;
		display: flex;
		justify-content: space-around;
	}	
	.other-item{
		
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		
	
	
	}
	.other-item image{
		width: 80rpx;
		height: 80rpx;
		
	
	}
</style>